{#
 This Source Code Form is subject to the terms of the Mozilla Public
 License, v. 2.0. If a copy of the MPL was not distributed with this
 file, You can obtain one at https://mozilla.org/MPL/2.0/.
#}

{% from "macros-protocol.html" import callout, picto with context %}

{% extends "/firefox/base/base-protocol.html" %}

{# "noindex" pages should not have the canonical or hreflang tags: bug 1442331 #}
{% block canonical_urls %}<meta name="robots" content="noindex,follow">{% endblock %}

{% block site_css %}
  {% if ftl_file_is_active('navigation_refresh') and ftl_file_is_active('footer-refresh') %}
    {{ css_bundle('m24-root') }}
    {{ css_bundle('m24-navigation-and-footer') }}
  {% else %}
    {{ css_bundle('legacy-navigation-and-footer') }}
  {% endif %}
  {{ css_bundle('protocol-firefox') }}
{% endblock %}

{% block page_css %}
  {{ css_bundle('protocol-picto') }}
  {{ css_bundle('protocol-callout') }}
  {{ css_bundle('nightly_firstrun') }}
{% endblock %}

{% block page_title_prefix %}{% endblock %}
{% block page_image %}{{ static('protocol/img/logos/firefox/browser/nightly/og.png') }}{% endblock %}
{% block page_favicon %}{{ static('img/favicons/firefox/browser/nightly/favicon.ico') }}{% endblock %}
{% block page_favicon_large %}{{ static('img/favicons/firefox/browser/nightly/favicon-196x196.png') }}{% endblock %}
{% block page_ios_icon %}{{ static('img/favicons/firefox/browser/nightly/apple-touch-icon.png') }}{% endblock %}
{% block page_title %}{{ ftl('nightly-firstrun-firefox-nightly') }}{% endblock %}
{% block page_title_suffix %}{% endblock %}
{% block page_og_url %}{{ firefox_url('desktop', 'all', 'nightly') }}{% endblock %}

{% block body_id %}firefox-firstrun{% endblock %}

{% block site_header %}{% endblock %}


{% block content %}
<main>
  {{ callout(
    title=ftl('nightly-firstrun-thank-you-for-using'),
    class='mzp-t-dark mzp-t-product-nightly main-header mzp-t-hero',
    heading_level=1,
    brand=True,
    brand_product='nightly',
    brand_type='logo',
    brand_size='xl',
  )}}

  <section class="contribute">
    <div class="mzp-l-content">
      <h2 class="contribute-title">{{ ftl('nightly-firstrun-choose-an-area') }}</h2>
      <ul class="contribute-list mzp-t-dark mzp-l-columns mzp-t-columns-three mzp-t-picto-center">
        {% call picto(
          title=ftl('nightly-firstrun-test'),
          heading_level=3,
          class='test',
          body=True,
          image=resp_img(
            url='img/firefox/firstrun/test.png',
            optional_attributes={
              'class': 'mzp-c-picto-image'
            }
          ),
          base_el='li'
        ) %}
          <p>{{ ftl('nightly-firstrun-find-and-file-bugs') }}</p>
          <a href="https://wiki.mozilla.org/Nightly#Filing_Bugs" class="mzp-c-button mzp-t-product mzp-t-dark" data-cta-text="Start testing" data-testid="start-testing">{{ ftl('nightly-firstrun-start-testing') }}</a>
        {% endcall %}

        {% call picto(
          title=ftl('nightly-firstrun-code'),
          heading_level=3,
          class='code',
          body=True,
          image=resp_img(
            url='img/firefox/firstrun/code.png',
            optional_attributes={
              'class': 'mzp-c-picto-image'
            }
          ),
          base_el='li'
        ) %}
          <p>{{ ftl('nightly-firstrun-file-bugs-and-work') }}</p>
          <a href="https://firefox-source-docs.mozilla.org/contributing/contributing_to_mozilla.html" class="mzp-c-button mzp-t-product mzp-t-dark" data-cta-text="Start coding" data-testid="start-coding">{{ ftl('nightly-firstrun-start-coding') }}</a>
        {% endcall %}

        {% call picto(
          title=ftl('nightly-firstrun-localize'),
          heading_level=3,
          class='localize',
          body=True,
          image=resp_img(
            url='img/firefox/firstrun/localize.png',
            optional_attributes={
              'class': 'mzp-c-picto-image'
            }
          ),
          base_el='li'
        ) %}
          <p>{{ ftl('nightly-firstrun-make-firefox-available') }}</p>
          <a href="{{ ftl('nightly-firstrun-contribute-link') }}" class="mzp-c-button mzp-t-product mzp-t-dark" data-cta-text="Start localizing" data-testid="start-localizing">{{ ftl('nightly-firstrun-start-localizing') }}</a>
        {% endcall %}
      </ul>
    </div>
  </section>

  {# Locale specific conmmunity promos #}
  {% block locale_promo %}{% endblock %}
</main>
{% endblock %}

{% block site_footer %}
  {% with theme_class='mzp-t-ink' %}
    {% include 'includes/protocol/footer/footer.html' %}
  {% endwith %}
{% endblock %}

{# Exclude stub attribution for in-product pages: issus 9620 #}
{% block stub_attribution %}{% endblock %}
